<template>
  <view class="admin-container">
    <!-- 顶部导航 -->
    <view class="admin-header">
      <text class="header-title">系统管理控制台</text>
      <view class="header-right">
        <text class="admin-name">{{ adminInfo.username }}</text>
        <button class="logout-btn" @tap="handleLogout">退出</button>
      </view>
    </view>

    <!-- 数据概览 -->
    <scroll-view class="dashboard" scroll-x="true">
      <view class="stats-card">
        <text class="stats-value">{{ statistics.userCount }}</text>
        <text class="stats-label">注册用户</text>
      </view>
      <view class="stats-card">
        <text class="stats-value">{{ statistics.contentCount }}</text>
        <text class="stats-label">待审内容</text>
      </view>
     <!-- <view class="stats-card">
        <text class="stats-value">{{ statistics.newsCount }}</text>
        <text class="stats-label">资讯总量</text>
      </view> -->
    </scroll-view>

    <!-- 功能导航 -->
    <view class="function-grid">
      <!-- 用户管理 -->
      <view class="grid-item" @tap="navigateTo('user')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/用户管理.png"></image>
        <text class="grid-text">用户管理</text>
      </view>
      
      <!-- 内容审核 -->
      <view class="grid-item" @tap="navigateTo('content')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/内容审核.png"></image>
        <text class="grid-text">内容审核</text>
      </view>

      <!-- 资讯管理 -->
     <!-- <view class="grid-item" @tap="navigateTo('news')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/资讯管理.png"></image>
        <text class="grid-text">资讯管理</text>
      </view> -->

      <!-- 纪念卡管理 -->
      <view class="grid-item" @tap="navigateTo('commemorative')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/纪念卡.png"></image>
        <text class="grid-text">纪念卡管理</text>
      </view>

      <!-- 题目管理 -->
      <view class="grid-item" @tap="navigateTo('question')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/加题面板_题目.png"></image>
        <text class="grid-text">题目管理</text>
      </view>

      <!-- 卡片管理 -->
     <!-- <view class="grid-item" @tap="navigateTo('card')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/图表-卡片.png"></image>
        <text class="grid-text">卡片管理</text>
      </view> -->

      <!-- 历史管理 -->
     <!-- <view class="grid-item" @tap="navigateTo('history')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/历史.png"></image>
        <text class="grid-text">历史管理</text>
      </view>
      
      <view class="grid-item" @tap="navigateTo('administrator')">
        <image class="grid-icon" src="https://mp-1de2ab47-60cc-4717-bb0c-985e43d6d68e.cdn.bspapp.com/img/icon/管理员_管理员列表.png"></image>
        <text class="grid-text">添加管理员</text>
      </view> -->
    </view>

    <!-- 系统信息 -->
    <view class="system-info">
      <view class="info-item">
        <text>系统版本：{{ systemInfo.version }}</text>
        <text>服务器状态：{{ systemInfo.status }}</text>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      adminInfo: {
        username: "管理员",
        role: "超级管理员"
      },
      statistics: {
        userCount: 23,
        contentCount: 16,
        newsCount: 10
      },
      systemInfo: {
        version: "2.3.1",
        status: "正常"
      }
    }
  },
  onLoad() {
    // this.checkLoginStatus()
    this.getContentCount()
    this.getUserCount()
  },
  methods: {
   async getUserCount(){
     const params = {
       keyword: "",
       status: '',
     }
       const res = await uniCloud.callFunction({
                name: 'getUserList',
                data: params
              })
      if(res.result.code === 0){
        this.statistics.userCount = res.result.data.total
      }
    },
   async getContentCount(){
      const res = await uniCloud.callFunction({
                name: 'get-review-topics',
                data: {
                  page: this.page,
                  pageSize: this.pageSize
                }
              })
              if(res.result.code === 200){
                this.statistics.contentCount = res.result.data.length || 0
              }
    },
    checkLoginStatus() {
      if (!getApp().globalData.isAdmin) {
        uni.redirectTo({ url: '/pages/adminLogin/adminLogin' })
      }
    },
    handleLogout() {
      uni.removeStorageSync('adminToken')
      getApp().globalData.isAdmin = false
      uni.redirectTo({ url: '/pages/adminLogin/adminLogin' })
    },
    navigateTo(page) {
      const routeMap = {
        user: '/pages/userManage/userManage',
        content: '/pages/contentReview/contentReview',
        news: '/pages/newsManage/newsManage',
        commemorative: '/pages/commemorativeCard/commemorativeCard',
        question: '/pages/questionManage/questionManage',
        card: '/pages/cardManage/cardManage',
        history: '/pages/historyManage/historyManage',
        administrator:'/pages/addAdmin/addAdmin',
      }
      uni.navigateTo({ url: routeMap[page] })
    }
  }
}
</script>

<style lang="scss" scoped>
.admin-container {
  padding: 30rpx;
  background-color: #f5f7fa;
  min-height: 100vh;
}

.admin-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30rpx;
  background: #ffffff;
  border-radius: 16rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.05);

  .header-title {
    font-size: 36rpx;
    font-weight: bold;
    color: #2c3e50;
  }

  .header-right {
    display: flex;
    align-items: center;
    gap: 30rpx;

    .admin-name {
      font-size: 28rpx;
      color: #666;
    }

    .logout-btn {
      padding: 10rpx 30rpx;
      background: #e74c3c;
      color: white;
      border-radius: 8rpx;
      font-size: 26rpx;
    }
  }
}

.dashboard {
  white-space: nowrap;
  margin-bottom: 30rpx;

  .stats-card {
    display: inline-block;
    width: 300rpx;
    padding: 30rpx;
    margin-right: 20rpx;
    background: white;
    border-radius: 16rpx;
    box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.05);

    .stats-value {
      display: block;
      font-size: 48rpx;
      font-weight: bold;
      color: #3498db;
      margin-bottom: 15rpx;
    }

    .stats-label {
      font-size: 28rpx;
      color: #7f8c8d;
    }
  }
}

.function-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20rpx;
  margin-bottom: 30rpx;

  .grid-item {
    background: white;
    padding: 30rpx;
    border-radius: 16rpx;
    text-align: center;
    box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.05);
    min-height: 180rpx;

    .grid-icon {
      width: 70rpx;
      height: 70rpx;
      margin-bottom: 15rpx;
    }

    .grid-text {
      font-size: 28rpx;
      color: #34495e;
    }
  }
}

.system-info {
  background: white;
  padding: 30rpx;
  border-radius: 16rpx;
  box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.05);

  .info-item {
    display: flex;
    justify-content: space-between;
    font-size: 26rpx;
    color: #7f8c8d;
  }
}
</style>